<template>
	<view class="content">
		<u-navbar placeholder title="添加供货商" :autoBack="true"></u-navbar>
		<view class="from-list">
			<u-form :model="qureForm" :rules="rules" ref="uForm" :labelWidth="80">
				<u-form-item label="名称" prop="name">
					<u-input v-model="qureForm.name" inputAlign="right" placeholder="请输入名称" border="none"></u-input>
				</u-form-item>
				<u-form-item label="联系人" prop="contacts">
					<u-input v-model="qureForm.contacts" inputAlign="right" placeholder="请输入联系人"
						border="none"></u-input>
				</u-form-item>
				<u-form-item label="联系电话" prop="phone">
					<u-input v-model="qureForm.phone" inputAlign="right" placeholder="请输入联系电话" border="none"></u-input>
				</u-form-item>
				<u-form-item label="地址" prop="address">
					<u-input v-model="qureForm.address" inputAlign="right" placeholder="请输入地址" border="none"></u-input>
				</u-form-item>
				<u-form-item label="邮箱" prop="email">
					<u-input v-model="qureForm.email" inputAlign="right" placeholder="请输入邮箱" border="none"></u-input>
				</u-form-item>
				<u-form-item label="经营方式">
					<u-radio-group v-model="qureForm.category" placement="row">
						<u-radio activeColor="#2FCC71" name="自营" label="自营"></u-radio>
						<u-radio style="margin-left: 20rpx;" name="供销" activeColor="#2FCC71" label="供销"></u-radio>
					</u-radio-group>
				</u-form-item>
			</u-form>
		</view>
		<view class="submit-but">
			<view class="add-but" @click="submit">确定</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				qureForm: {
					id: null,
					name: null,
					phone: null,
					contacts: null,
					email: null,
					category: "自营",
					address: null,
				},
				rules: {
					name: {
						required: true,
						message: '请填写名称',
						trigger: ['blur', 'change']
					}
				}
			}
		},
		onLoad(option) {
			this.getList()
			// if (option.id) {
			// 	this.qureForm.id = option.id
			// 	this.getList(option.id)

			// }
		},
		methods: {
			hideKeyboard() {
				uni.hideKeyboard()
			},
			async getList() {
				let res = await this.$apis.procurement.getSupplier()
				let item = res.data
				this.qureForm.name = item.name
				this.qureForm.phone = item.phone
				this.qureForm.contacts = item.contacts
				this.qureForm.email = item.email
				this.qureForm.category = item.category
				this.qureForm.address = item.address
			},
			async submit() {
				try {
					let validate = await this.$refs.uForm.validate()
					if (validate) {
						if (this.qureForm.id) {
							let res = this.$apis.procurement.updateSupplier(this.qureForm)
							uni.showToast({
								title: '修改成功',
								icon: 'success',
								duration: 1500
							})
						} else {
							let res = this.$apis.procurement.addSupplier(this.qureForm)
							uni.showToast({
								title: '添加成功',
								icon: 'success',
								duration: 1500
							})
						}

						setTimeout(() => {
							uni.navigateBack()
						}, 1500)
					}
				} catch (e) {
					console.log(e);
				}


			},
		}
	}
</script>

<style scoped lang="scss">
	.content {
		padding-bottom: calc(130rpx + env(safe-area-inset-bottom) / 2) !important;
	}

	.img-upload {
		width: 688rpx;
		margin: 0 auto;
		margin-top: 31rpx;
		display: flex;
		align-items: center;
		padding: 23rpx;
		font-size: 14px;
		color: #303133;
		background-color: #fff;
		border-radius: 10rpx;
	}

	.img-list {
		width: 688rpx;
		margin: 0 auto;
		margin-top: 31rpx;
		border-radius: 10rpx;
		padding: 23rpx;
		font-size: 14px;
		color: #303133;
		background-color: #fff;
	}

	.from-list {
		width: 688rpx;
		margin: 0 auto;
	}

	.from-list ::v-deep .u-form-item {
		background-color: #fff;
		margin-top: 31rpx;
		padding: 5rpx 23rpx;
	}

	.from-list ::v-deep .u-form-item__body__right__content__slot {
		display: flex !important;
		flex-direction: row !important;
		align-items: center !important;
	}

	.from-list ::v-deep .u-radio:first-child {
		margin-left: auto !important;
	}

	.from-list ::v-deep .u-radio {
		margin-left: 20rpx;
	}

	.from-list ::v-deep .u-textarea {
		padding-left: 0;
	}
</style>